<template>
	<view class="contain-main-box">
		<navigationTop navigationTitle="我的"></navigationTop>
		<u-toast ref="uToast" />
	<view class="main-bg">
		<!-- body start -->
		<view class="center-by">
			<!-- 头像start -->
			<view class="img-user">
				<image :src="$store.state.baseImg + '/icon/userUrl.jpg'"></image>
			</view>
			<!-- 头像end -->
			<!-- 内容start -->
			<view class="form-box">
				<!-- start -->
				<view class="form-items">
					<!-- 左侧 -->
					<view class="left-item">
						<view class="up-item">机房</view>
						<view class="down-item">{{userInfo.remarks||"-"}}</view>
					</view>
					<!-- 右侧 -->
					<view class="right-item">
						<view class="up-item">设备</view>
						<view class="down-item">{{userInfo.loginFlag||"-"}}</view>
					</view>
				</view>
				<!-- 信息all -->
				<view class="form-items">
					<view class="text-item">{{userInfo.loginName||"-"}}</view>
					<view class="text-item">{{userInfo.mobile||"-"}}</view>
					<!-- <view class="text-item">{{userInfo.no||"-"}}</view> -->
					<view class="text-item"><button type="default" @tap="goMyDetail">{{userInfo.no||"-"}}</button></view>
				</view>
				<!-- end -->
			</view>
			<!-- 内容start -->
		</view>
		<!-- body end -->
	</view>
	</view>
</template>

<script>
	import navigationTop from "@/components/navigationTop/index.vue"
	export default {
		name: "adminTab",
		components:{
			navigationTop
		},
		data() {
			return {
				userInfo:{}
			}
		},
		onNavigationBarButtonTap(val){
			this.$backToIndex(val)
		},
		mounted() {
			this.getData()
		},
		methods: {
			refreshData(){
				this.getData().then((res)=>{
					this.$refs.uToast.show({
						title: '更新成功',
						type: 'success',
						duration: 1500
					})
				})
			},
			getData(){
				return new Promise((resolve,reject)=>{
					this.$http.httpRequest({
						methods: "get",
						url: this.$api.userList
					}).then((res)=>{
						uni.stopPullDownRefresh()
						if(!res){
							return uni.showToast({
									title: "服务器请求出错",
									icon:"none"
								})
						}
						resolve(res)
						this.$store.commit('set_userInfo',res.data.user);
						this.userInfo = {
							...this.$store.state.userInfo
						}
					}).catch((err)=>{
						uni.stopPullDownRefresh()
						reject(err)
						return uni.showToast({
								title: "服务器请求出错",
								icon: "none"
							})
					})
				})

			},
			goMyDetail(){
				uni.navigateTo({
					url: "/pages/home/home"
				})
			}
		}
	}
</script>

<style scoped>
.own-name{
	padding: 52rpx 30rpx 0;
}
.center-by{
	padding: 30rpx;position: relative;
}
.center-by .img-user{
	width: 100%;height: 220rpx;
	margin: 0 auto;
	float: left;
}
.img-user image{
	width: 220rpx;height: 220rpx;border-radius: 50%;margin: 0 auto;display: block;
}
.form-box{
	margin-top: 110rpx;
	background: rgba(255,255,255,0.9);background-size: cover;border-radius: 30rpx;
	padding: 120rpx 35rpx;box-shadow: 0 0 30rpx rgba(33,44,103,0.5);
}
.form-items{
	display: flex;
	align-items: auto;text-align: center;
	flex-direction: row;
	flex-wrap: wrap;
	padding-top: 80rpx;
}
.left-item{
	width: 50%;
}
.right-item{
	width: 50%;
}
.up-item{
	height: 32rpx;line-height: 32rpx;color: #919297;
}
.down-item{
	margin-top: 10rpx;
	height: 32rpx;line-height: 32rpx;color: #212c67;
}
.text-item{
	width: 100%;height: 80rpx;line-height: 80rpx;color: #212c67;
}
.text-item button{
	background: #212c67;color: #fff;width: 260rpx;font-weight: normal;font-size: 30rpx;border-radius: 50rpx;
}
</style>
